<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Add Inventory</title>
<script>
	$(function() {
		var name = $("#name"), jobTitle = $("#jobTitle"), address = $("#address"), phone = $("#phone"), hireDate = $("#hireDate"), allFields = $(
				[]).add(name).add(jobTitle).add(address).add(phone).add(
				hireDate), tips = $(".validateTips");

		function updateTips(t) {
			tips.text(t).addClass("ui-state-highlight");
			setTimeout(function() {
				tips.removeClass("ui-state-highlight", 1500);
			}, 500);
		}

		function checkLength(o, n, min, max) {
			if (o.val().length > max || o.val().length < min) {
				o.addClass("ui-state-error");
				updateTips("Length of " + n + " must be between " + min
						+ " and " + max + ".");
				return false;
			} else {
				return true;
			}
		}
		function checkRegexp(o, regexp, n) {
			if (!(regexp.test(o.val()))) {
				o.addClass("ui-state-error");
				updateTips(n);
				return false;
			} else {
				return true;
			}
		}

		$("#dialog-form").dialog({
			autoOpen : false,
			height : 450,
			width : 350,
			modal : true,
			buttons : {
				"Cancel" : function() {
					$(this).dialog("close");
				}
			},
			close : function() {
				allFields.val("").removeClass("ui-state-error");
			}
		});

		$("#create-user").button().click(function() {
			$("#dialog-form").dialog("open");
		});

		$("#add-worker").button().click(function() {
			confirm("Send for Validation ?");
			var bValid = true;
			allFields.removeClass("ui-state-error");
			bValid = bValid && checkLength(name, "name", 3, 50);
			bValid = bValid && checkLength(jobTitle, "jobTitle", 3, 30);
			bValid = bValid && checkLength(address, "address", 20, 200);
			bValid = bValid && checkLength(phone, "phone", 10, 10);
			if (bValid) {
				/* $("#users tbody").append(
						"<tr>" + "<td>" + name.val() + "</td>"
								+ "<td>" + jobTitle.val()
								+ "</td>" + "<td>"
								+ address.val() + "</td>"
								+ "<td>" + phone.val()
								+ "</td>" + "<td>"
								+ hireDate.val() + "</td>"
								+ "</tr>");
				 */
				$(this).dialog("close");
				return true;
			} else
				return false;
		});
	});
</script>


</head>
<body>
	<div title="Add a new Employee">
	<p class="validateTips">All form fields are required.</p>
	<form name="addWorker"
		action="<%=request.getContextPath()%>/Controller" method="post">
		<input type="hidden" name="whereFrom" value="addWorker.jsp">
		<fieldset>
			<label for="name">Item Name</label> <input type="text" name="name"
				id="name" class="text ui-widget-content ui-corner-all" /> <label
				for="jobTitle">Item Category</label> <input type="text" name="jobTitle"
				id="jobTitle" value="" class="text ui-widget-content ui-corner-all" />
			<label for="address">Address</label> <input type="text"
				name="address" id="address" value=""
				class="text ui-widget-content ui-corner-all" /> <label for="phone">Phone</label>
			<input type="text" name="phone" id="phone" value=""
				class="text ui-widget-content ui-corner-all" /> <label
				for="hireDate">Hire Date</label> <input type="text" name="hireDate"
				id="hireDate" value="" class="text ui-widget-content ui-corner-all" />
		</fieldset>
		<button id="add-worker" type="submit">Add a Worker</button>
	</form>
	</div>
</body>
